<template>
  <div>
    <a-row>
      <a-col :span="21">
        <a-select
          v-model="curValue"
          :style="{ width: '100%' }"
          placeholder="采购订单号"
          disabled
          @select="onSelect"
          @search="handleSearch"
          :open="false"
        >
          <a-icon slot="suffixIcon" type="null" />
          <a-select-option v-for="item in dataSource" :key="item.Id" :value="item.Id"
            >{{ item.Code }}({{ item.Name }})</a-select-option
          >
        </a-select>
      </a-col>
      <a-col :span="3">
        <a-button type="primary" :disabled="disabled" @click="handleOpenChoose" style="padding: 0 5px; width: 100%">
          <a-icon type="search" />
        </a-button>
      </a-col>
    </a-row>
    <InStorageChoose ref="inStorageChoose" @onChoose="handleChoose"></InStorageChoose>
  </div>
</template>
<script>
import InStorageChoose from './InStorageChoose.vue'
export default {
  props: {
    value: { type: String, required: false },
    disabled: { type: Boolean, required: false, default: false }
  },
  components: {
    InStorageChoose
  },
  data() {
    return {
      curValue: '',
      keyword: '',
      timeout: null,
      dataSource: []
    }
  },
  watch: {
    value: {
      handler(n, o) {
        this.curValue = n
        if (n) {
          this.search(n)
        } else {
          this.dataSource = []
        }
      },
      immediate: true,
      deep: true
    }
  },

  methods: {
    search(n) {
      this.$http
        .post('/PB/PB_Purchase/GetPurchaseDataList', {
          PageIndex: 1,
          PageRows: 25,
          SortField: 'CreateTime',
          SortType: 'desc',
          Search: { keyword: n }
        })
        .then(res => {
          this.dataSource = res.Data
        })
    },
    onSelect(value, option) {
      this.$emit('input', value)
      var rowQuery = this.dataSource.filter((val, index, arr) => {
        return val.Id == value
      })
      if (rowQuery.length > 0) {
        this.$emit('select', rowQuery[0])
      }
    },
    handleSearch(value) {
      this.reload(value)
    },
    handleOpenChoose() {
      this.$refs.inStorageChoose.openChoose()
    },
    handleChoose(selectedRows) {
      this.dataSource = [...selectedRows]
      var row = selectedRows[0]
      this.curValue = row.Id
      this.$emit('input', this.curValue)
      this.$emit('select', row)
      console.log(row)
    }
  }
}
</script>
